<template>
	<div class="appVue">
		<header >
			<div class='header_fixed'>
				<div class="navigation"><myheader :imgUrl='imgUrls' :closeWZA="closeWZA" @closeChange="closeChange" @searchDel="searchDel"></myheader></div>
				<commonNavs :closeWZAChange="closeWZAChange"></commonNavs>
			</div>
			
			<search @searchDel="searchDel" v-if="isSearchDel"></search>
			
		</header>
		<div class="sectionbanner"><slot name="sectionbanner"></slot></div>
		<div class="sectionContent"><slot name="sectionContent"></slot></div>
		<footer>
			<backtop></backtop>
			<contact></contact>
			<information></information>
		</footer>
	</div>
</template>
<script>
import { defineAsyncComponent } from 'vue';
export default {
	components: {
		myheader: defineAsyncComponent(() => import(rootPath + '/src/components/header/header.vue')),
		search: defineAsyncComponent(() => import(rootPath + '/src/components/header/search.vue')),
		information: defineAsyncComponent(() => import(rootPath + '/src/components/footer/information.vue')),
		backtop: defineAsyncComponent(() => import(rootPath + '/src/components/footer/backtop.vue')),
		contact: defineAsyncComponent(() => import(rootPath + '/src/components/footer/contact.vue')),
		commonNavs: defineAsyncComponent(() => import(rootPath + '/src/components/header/nav.vue'))
	},
	props: ['closeWZA', 'imgUrl'],

	data() {
		return {
			isSearchDel: false,
			getAccessId: '',
			time: 0,
			closeWZAChange: false,
			imgUrls:''
		};
	},
	watch: {
		closeWZA: {
			handler(newVal, oldVal) {
				if (newVal != oldVal) {
					this.closeWZAChange = newVal;
				}
			}
			//immediate: true
		},
		imgUrl: {
			handler(newVal, oldVal) {
				if (newVal != oldVal) {
					this.imgUrls = newVal;
				}
			},
			immediate: true
		},
	},
	created() {
		// console.log(localStorage.nextStatus,'localStorage.nextStatus111')
		//生成随机用户标识
		if (!sessionStorage['Anonymity-Header']) {
			sessionStorage['Anonymity-Header'] = randomWord(false, 6, 6);
		}
		if (sessionStorage.getAccessId) {
			this.getAccessRecord();
		}
	},
	mounted() {
		// window.addEventListener('beforeunload', this.beforeUnloadHandler);
	},
	// beforeDestroy() {
	// 	window.removeEventListener('beforeunload', this.beforeUnloadHandler);
	// },
	methods: {
		// beforeUnloadHandler() {
		// 	if(JSON.parse(localStorage.nextStatus)) {
		// 	}else {
		// 		if(window.location.origin.includes('127')) {
		// 			localStorage.qqq = 1
		// 		}else {
		// 			localStorage.qqq = 2
		// 			localStorage.removeItem('userInfo');
		// 			}
		// 		}
		// },
		searchDel(val) {
			this.isSearchDel = val;
		},
		getAccessRecord() {
			let param = {
				id: sessionStorage.getAccessId,
				time: Date.now() - sessionStorage.getAccessTime
			};
			contentApi.getAccessRecord(param, res => {});
		},
		closeChange(val) {
			this.closeWZAChange = val;
		}
	}
};
</script>

<style scoped>
.appVue {
	width: 100%;
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.header_fixed{
	position: fixed;
	left: 0;
	z-index: 999;
	width: 100%;
}
.sectionContent {
	width: 100%;
	margin: auto;
}
.navigation {
	width: 100%;
}

</style>
<style>
.mhover:hover {
	color: #ff3333;
	cursor: pointer;
}
</style>
